/**
 * 旋转验证
 */
console.log("%c%s", "color:#ffffff;padding:20px;background:red;font-weight: bold;", "旋转验证");
(function() {
    let rot = function(opt) {
        this.opt = {
            ...opt,
            post: opt.post
        };


        if (opt.post && Object.prototype.toString.call(opt.post) != "[object Function]") {
            throw "opt.post 必须为函数"
        };
        console.log()
        if (opt.images && Object.prototype.toString.call(opt.images) != "[object Array]") {
            throw "opt.images 必须为数组"
        };
        this.width = opt.width ? opt.width : 200;
        this.height = opt.height ? opt.height : 200;
        this.images = opt.images ? opt.images : [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
        this._opt = opt.images;

        this.body = document.getElementsByTagName("body")[0]; //获取body对象
        this.div = document.createElement("div"); //创建对象
        this.div.setAttribute("class", "rotationverificationWrap"); //创建属性
        this.div.style.display = "none";
        let _ra = Math.random();
        let _box = "";
        let _boxWrap = "";
        let _this = this;
        this.div.innerHTML = "<div class='rotationverification' style='background-image: url(./images/" + parseInt(_ra * 10) + ".jpeg); transform: rotate(" + _ra * 100 + "deg)'><div class='rotationverificationSuccess'>success</div></div><div class='rotationverificationText'>请把图片转正</div>";
        this.body.appendChild(this.div);
        this._box = document.getElementsByClassName("rotationverification")[0]; //获取box对象
        this._boxWrap = document.getElementsByClassName("rotationverificationWrap")[0]; //获取box对象
        this._Success = document.getElementsByClassName("rotationverificationSuccess")[0]; //获取成功对象
        this._Text = document.getElementsByClassName("rotationverificationText")[0]; //文本对象
        _box = this._box;

        this._box.style.width = this.opt.width + "px"; //设置宽
        this._box.style.height = this.opt.height + "px"; //设置高
        this._box.style.marginLeft = -this.opt.width / 2 + "px"; //设置宽
        this._box.style.marginTop = -this.opt.height / 2 + "px"; //设置高
        this._Text.style.marginTop = this.opt.height / 2 + 10 + "px"; //设置高
        this._Success.style.lineHeight = this.opt.height + "px"; //设置行高
        _boxWrap = this._boxWrap;
        _Success = this._Success;
        _Text = this._Text;
        var _mouse = false,
            _s = 0,
            _r = 0;
        //鼠标按下
        this._box.addEventListener("mousedown", function(e) {
            _mouse = true;
            _s = rotate(e.clientX, e.clientY);
            _r = parseInt(_box.style.transform.replace(/[^0-9.]/ig, ''));
        });

        //鼠标旋转
        this._box.addEventListener("mousemove", function(e) {
            if (_mouse) {

                let _v = _r + (rotate(e.clientX, e.clientY) - _s);
                _box.style.transform = "rotate(" + _v + "deg)";
                if (_v < 2 && _v > 0) {

                    _mouse = false;
                    _Success.style.display = "block";
                    setTimeout(function() {
                        _boxWrap.style.display = "none";
                        _this.opt.post();
                    }, 1000);
                }
            };
        });
        //鼠标松开
        this._box.addEventListener("mouseup", function(e) {
            _mouse = false;
        });

        //旋转验证函数
        function rotate(x, y) {
            var _x, _y, ret, val;
            _x = x - _boxWrap.offsetWidth / 2;
            _y = y - _boxWrap.offsetHeight / 2;

            val = 180.0 / Math.PI;
            ret = Math.atan2(_y, _x) * val;
            return ret;
        };
    };

    //显示
    rot.prototype.show = function() {

        _Success.style.display = "none";
        let _ra = Math.random();
        this.div.style.display = "block";
        this._box.style.transform = "rotate(" + (_ra * 100 + 50) + "deg)";
        //console.log(this)
        let _img = "";

        if (this._opt) {
            _img = parseInt(_ra * 10) > this.images.length ? this.images[this.images.length - 1] : this.images[parseInt(_ra * 10)];
        } else {
            _img = parseInt(_ra * 10) > this.images.length ? "./images/" + this.images.length - 1 + ".jpeg" : "./images/" + parseInt(_ra * 10) + ".jpeg";
        }
        //console.log(this.images.length);
        //console.log(parseInt(_ra * 10));
        //console.log(_img);
        this._box.style.backgroundImage = "url(" + _img + ")";
    };
    window.r_v = rot;
})();